<template>
    <el-dialog title="订单备注" :visible.sync="orderRemarkesVisible" :before-close="closeOrderRemarkesDialog">
        <el-form :model="orderRemarkesForm" :rules="rules" ref="ruleForm" label-width="80px" size="small">
            <el-form-item label="订单号" >
                <el-input v-model="orderRemarkesForm.number" autocomplete="off" disabled></el-input>
            </el-form-item>
           <el-form-item label="订单备注" prop="merchantRemarks">
                <el-input v-model="orderRemarkesForm.merchantRemarks" autocomplete="off" type="textarea" rows="3"></el-input>
            </el-form-item>
        </el-form>
        <div slot="footer" class="dialog-footer">
            <el-button @click="closeOrderRemarkesDialog">取 消</el-button>
            <el-button type="primary" @click="comitDialog">确 定</el-button>
        </div>
    </el-dialog>
</template>
<script>
import {updateOrderRemarksByOrderId} from '@/api/modules/orderManagement/order.js'
export default {
    props: {
        orderRemarkesVisible: {
            type: Boolean,
            default: false
        },
        orderRemarkesForm:{
            type: Object
        },
    },
    data() {
        return {
            rules: {
                merchantRemarks:[
                    { required: true, message: '请输入订单备注', trigger: 'blur' },
                ],
            },
        }
    },
    methods: {
        closeOrderRemarkesDialog(){
            this.$emit("closeOrderRemarkesDialog")
        },
        comitDialog(){
            this.submitForm("ruleForm");
        },
        orderRemarkesOperationFrom(){
          this.$emit("orderRemarkesOperationFrom")
        },
        submitForm(formName) {
            this.$refs[formName].validate((valid) => {
                if (valid) {
                    // alert('submit!');
                    let data = {orderId:this.orderRemarkesForm.orderId,merchantRemarks:this.orderRemarkesForm.merchantRemarks}
                    updateOrderRemarksByOrderId(data).then(()=>{
                        this.$message({
                            message: '修改成功！',
                            type: 'success'
                        });
                        this.orderRemarkesOperationFrom()
                    })
                } else {
                    console.log('error submit!!');
                    return false;
                }
            });
        }
    }
}
</script>
<style scoped>
</style>